{extend name="panel/layout" /}
{block name="main"}
<div class="container-fluid main-content">
    <div class="row">
        <div class="col-lg-12">
            <ul class="breadcrumb">
                <li>
                    <a href="/"><i class="icon-home"></i></a>
                </li>
                <li>
                    <a href="{:url('index')}">管理面板</a>
                </li>
                <li class="active">
                    兑换金币
                </li>
            </ul>
        </div>
    </div>
    <div class="row">
        <div class="col-xs-12">
            <div class="panel panel-success">
                <div class="panel-body">
                    {:getHtmlCode(config('web_gg_exchange'))}
                </div>
            </div>
        </div>
    </div>

    <div class="row">
        <div class="col-lg-12">
            <div class="widget-container fluid-height clearfix">
                <div class="heading">
                    <i class="icon-reorder"></i>兑换金币
                </div>
                <div class="widget-content padded">
                    <form class="form-horizontal" method="post">
                        <div class="form-group">
                            <label class="control-label col-md-2"></label>
                            <div class="col-md-7">
                                <div class="alert alert-success">
                                    你当前身份是：<font color="#8b4513">{$degree}</font></span><br>你的兑换比例是：1元=<font color="red">{$rate}</font>个金币！

                                </div>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="control-label col-md-2">可用余额</label>
                            <div class="col-md-7">
                                <div class="input-group">
                                    <input type="text" value="{$userInfo.rmb}" class="form-control" disabled>
                                    <div class="input-group-addon">元</div>
                                </div>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="control-label col-md-2">剩余金币</label>
                            <div class="col-md-7">
                                <div class="input-group">
                                    <input type="text" value="{$userInfo.point}" class="form-control" disabled>
                                    <div class="input-group-addon">个</div>
                                </div>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="control-label col-md-2">兑换金额</label>
                            <div class="col-md-7">
                                <div class="input-group">
                                    <input type="number" name="num" value="1" id="num" class="form-control"
                                           onchange="getPoint();" required>
                                    <div class="input-group-addon">元</div>
                                </div>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="control-label col-md-2">可得金币</label>
                            <div class="col-md-7">
                                <div class="input-group">
                                    <input type="number" value="{$rate}" class="form-control" id="need" disabled>
                                    <div class="input-group-addon">个</div>
                                </div>
                            </div>
                        </div>

                        <div class="form-group">
                            <label class="control-label col-md-2"></label>
                            <div class="col-md-7">
                                <button class="btn btn-primary" type="submit">确认兑换</button>
                                <button class="btn btn-default-outline" type="reset">重置</button>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
</div>
{/block}
{block name="footJs"}
<script type="text/javascript">
    function getPoint() {
        var value = $('#num').val();
        $('#need').val(value * {$rate});
    }
</script>
{/block}
